<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
    <title>{$tkd.title|parseTpl}</title>
    <meta name="keywords" content="{$tkd.keywords|parseTpl}">
    <meta name="description" content="{$tkd.description|parseTpl}">
    <link rel="stylesheet" type="text/css" href="{$kx.config.resurl}/template/kxmobileno2/css/ptm.min.css" />
    <link rel="stylesheet" type="text/css" href="{$kx.config.resurl}/template/kxmobileno2/css/skin.min.css" />
    <link rel="stylesheet" type="text/css" href="{$kx.config.resurl}/template/kxmobileno2/css/font-awesome.min.css" />
</head>
<body class="pt-dir-page">
<header class="ptm-bar ptm-bar-nav  ptm-fix">
    <a class="ptm-pull-left" href="{$kx.config.mobileurl}">
        <span class="ptm-iconfont fa fa-home" style="font-size:22px;"></span>
    </a>
    <div class="ptm-title">{$novel.name}</div>
    <a class="ptm-pull-right" href="{link=user.index.index}">
        <span class="ptm-iconfont  fa fa-user"></span>
    </a>
</header>
{block method="pagination" name="paginate" page=$page limit=50 count=$last.id}
{block method=chapter.list novelid=$novel.id page=$page name=$list num=50 sort=$sort}
<section class="pt-infopage-more" style="margin-top:60px;">
    <div class="ptm-card pt-dir-list">
        <div class="ptm-card-header" style="background: #eee">
            <div class="ptm-col-xs-9" style="padding-right:10px">
                <button class="ptm-btn ptm-btn-primary ptm-btn-block ptm-btn-outlined showdir"><span>{=($paginate.current-1)*50+1}-{=$paginate.current*50}章</span><i class="fa fa-angle-down pt-dir-icon"></i></button>
            </div>
            {if $sort=='asc'}
            <div class="ptm-col-xs-3">
                <a class="ptm-btn ptm-btn-primary ptm-btn-block ptm-btn-outlined" href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=desc siteid=$siteid page=$paginate.current}">正序 <i class="fa fa-sort-amount-asc"></i></a>
            </div>
            {else}
            <div class="ptm-col-xs-3">
                <a class="ptm-btn ptm-btn-primary ptm-btn-block ptm-btn-outlined" href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=asc siteid=$siteid page=$paginate.current}">倒序 <i class="fa fa-sort-amount-desc"></i></a>
            </div>
            {/if}
        </div>
        <div class="ptm-card-content pt-dir">
            <ul class="ptm-list-view">
                {section loop=list}
                <li class="ptm-list-view-cell">
                    <a href="{link=novel.chapter.read novelid=$novel.id pinyin=$novel.pinyin chapterid=$loop.chapterid}">{=($paginate.current-1)*50+$i.order}.{$loop.name}</a>
                </li>
                {/loop}
            </ul>
        </div>
        <div class="ptm-card-footer " style="background: #eee">
            <div class="ptm-col-xs-3">
                <a class="ptm-btn ptm-btn-primary ptm-btn-block ptm-btn-outlined" href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=asc siteid=$siteid page=$paginate.prev}">上一页</a>
            </div>
            <div class="ptm-col-xs-6" style="padding:0 10px;">
                <button class="ptm-btn ptm-btn-primary ptm-btn-block ptm-btn-outlined showdir"><span>{=($paginate.current-1)*50+1}-{=$paginate.current*50}章</span><i class="fa fa-angle-down pt-dir-icon"></i></button>
            </div>
            <div class="ptm-col-xs-3">
                <a class="ptm-btn ptm-btn-primary ptm-btn-block ptm-btn-outlined" href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=asc siteid=$siteid page=$paginate.next}">下一页</a>
            </div>
        </div>
    </div>
</section>
{include file="/system/footer"}
<div class="sel ptm-hide">
    <div class="ptm-alert-shade"></div>
    <div class="pt-dir-sel" style="background-position: left 50px;">
        <p class="title">请选择章节</p>
        <ul>
            {if $paginate.items.0.num>1}
            <li><a href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=asc siteid=$siteid page=$paginate.first}">1-第50章</a></li>
            {/if}
            {loop=$paginate.items}
            {if $loop.status}
            <li class="active"><a href="__SELF__">{=($paginate.current-1)*50+1}-{=$paginate.current*50}章</a></li>
            {else}
            <li><a href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=asc siteid=$siteid page=$loop.num}">{=($loop.num-1)*50+1}-{=$loop.num*50}章</a></li>
            {/if}
            {/loop}
            {if $paginate.last>$loop.num}
            <li><a href="{link=novel.novel.dir novelid=$novel.id pinyin=$novel.pinyin sort=asc siteid=$siteid page=$paginate.last}">{=($paginate.last-1)*50+1}-{$last.id}章</a></li>
            {/if}
        </ul>
    </div>
</div>
<script type="text/javascript">
    $('.showdir').on('click',function(){
        $('.sel').removeClass('ptm-hide')
    })
    $('.ptm-alert-shade').on('click',function(){
        $('.sel').addClass('ptm-hide')
    })
</script>
</body>
</html>